<template>
  <div class="video-container">
    <el-dialog
      v-model="userStore.videoPopupShow"
      :before-close="close"
      title="播放视频"
      width="53%"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
    >
      <iframe  :src="videoSrc" frameborder="0" width="100%" height="518px"></iframe> 
    </el-dialog>
  </div>
</template>

<script lang="ts" setup>
import { ref, reactive, onMounted } from 'vue'
import { useUserStore } from '@/store'
const userStore = useUserStore()
onMounted(()=>{

})
const props = defineProps({
  videoInfo: {
    type: Object,
    default: () => {
      return {}
    },
  },
})

//线上环境
// const videoSrc = `http://` + window.location.host + `/readiness/videoIndex.html?videosrc=${props.videoInfo.src}`

//开发环境
const videoSrc = `http://` + window.location.host + `/videoIndex.html?videosrc=${props.videoInfo.src}`

/** 取消 */
const close = () => {
  userStore.videoPopupShow = false
}
</script>

<style lang="scss" scoped>
.video-container {
  margin: 0 auto;
}

::v-deep .el-dialog__body {
  padding: 0 !important;
}
</style>
